<template>
  <div class="market-news">
    <div class="card-header">
      <h3>市场新闻</h3>
      <el-button type="text">更多</el-button>
    </div>
    <div class="news-list">
      <div v-for="(news, index) in newsList" :key="index" class="news-item">
        <div class="news-title">{{ news.title }}</div>
        <div class="news-time">{{ news.time }}</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'MarketNews',
  data() {
    return {
      newsList: [
        { title: '央行宣布降准0.25个百分点，释放长期资金约5000亿元', time: '2024-04-28 09:30' },
        { title: '一季度GDP同比增长5.3%，经济复苏态势良好', time: '2024-04-28 09:15' },
        { title: '新能源板块持续走强，多家公司发布一季度业绩预告', time: '2024-04-28 09:00' }
      ]
    }
  }
}
</script>

<style scoped>
.market-news {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
  padding: 16px;
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.card-header h3 {
  font-size: 18px;
  color: #303133;
  margin: 0;
}

.news-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.news-item {
  padding: 8px 0;
  border-bottom: 1px solid #ebeef5;
}

.news-title {
  font-size: 14px;
  color: #303133;
  margin-bottom: 4px;
}

.news-time {
  font-size: 12px;
  color: #909399;
}
</style> 